import DataDetailsCard from '../../components/cards/data-details-card/DataDetailsCard';
import { getDataIds } from '../../requests/dataIdsRequest';
import { getSingleData } from '../../requests/singleDataRequest';

const SignelDataPage = (props) => {
  const data = props.selectedData;

  console.log(data);
  if (!data) {
    return <h1>{props.message}</h1>;
  }
  return <DataDetailsCard data={data.singleData} />;
};

export async function getStaticProps(context) {
  const dataId = context.params.dataId;

  try {
    const data = await getSingleData(dataId);
    return {
      props: {
        selectedData: data,
      },
      revalidate: 60,
    };
  } catch (error) {
    return {
      props: {
        selectedData: null,
        message: error.message,
      },
      revalidate: 60,
    };
  }
}

export async function getStaticPaths() {
  const firstPageDataIds = await getDataIds();

  console.log(firstPageDataIds);
  const paths = firstPageDataIds.dataIds.map((id) => ({
    params: { dataId: id },
  }));

  console.log(paths);
  return {
    paths: paths,
    fallback: 'blocking',
  };
}

export default SignelDataPage;